<template>
  <a-modal
    :title="$t('操作记录')"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @cancel="handleCancel"
    v-drag
  >
    <template slot="footer">
      <a-button @click="handleCancel">{{$t('关闭')}}</a-button>
    </template>
    <a-form @keyup.enter.native="getRecord">
      <a-row :gutter="12">
        <a-col :xl="11" :lg="12" :md="13" :sm="24">
          <a-form-item :label="$t('制卡时间')" :labelCol="{ span: 3 }" :wrapperCol="{ span: 21 }">
            <j-date
              :show-time="true"
              date-format="YYYY-MM-DD HH:mm:ss"
              :placeholder="$t('请选择开始时间')"
              class="query-group-cust"
              v-model="queryParam.createTime_begin"
            ></j-date
            >~
            <j-date
              :show-time="true"
              date-format="YYYY-MM-DD HH:mm:ss"
              :placeholder="$t('请选择结束时间')"
              class="query-group-cust"
              v-model="queryParam.createTime_end"
            ></j-date>
          </a-form-item>
        </a-col>
        <a-col :xl="7" :lg="8" :md="9" :sm="24">
          <a-form-item :label="$t('操作类型')" :labelCol="{ span: 6 }" :wrapperCol="{ span: 17 }">
            <a-select v-model="queryParam.type">
              <a-select-option :value="item.value" :key="index" v-for="(item, index) in typeList">{{
                item.title
              }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :xl="3" :lg="9" :md="10" :sm="24">
          <span class="table-page-search-submitButtons">
            <a-button type="primary" @click="getRecord()" icon="search">{{$t('查询')}}</a-button>
          </span>
        </a-col>
      </a-row>
    </a-form>
    <div>
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        class="j-table-force-nowrap"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="false"
        :loading="loading"
      >
      </a-table>
    </div>
  </a-modal>
</template>

<script>
import { initDictOptions, filterMultiDictText } from '@/components/dict/JDictSelectUtil'
import { getAction, putAction } from '@/api/manage'

export default {
  name: 'OperationRecordModal',
  components: {},
  data() {
    return {
      width: '1200px',
      visible: false,
      confirmLoading: false,
      typeList: [],
      queryParam: {
        column: 'createTime',
        order: 'desc',
        createTime_begin: '',
        createTime_end: '',
        type: '',
        cardInfo: '',
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 4 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 17 },
      },
      loading: false,
      dataSource: [],
      info:{},
      columns: [
        {
          title: this.$t('制卡时间'),
          align: 'center',
          dataIndex: 'createTime',
        },
        {
          title: this.$t('操作类型'),
          align: 'center',
          dataIndex: 'type_dictText',
        },
        {
          title: this.$t('卡类型'),
          align: 'center',
          dataIndex: 'cardKind_dictText',
        },
        {
          title: this.$t('卡号'),
          align: 'center',
          dataIndex: 'cardSn',
        },
        {
          title: this.$t('姓名'),
          align: 'center',
          dataIndex: 'name',
        },
        {
          title: this.$t('操作员'),
          align: 'center',
          dataIndex: 'createBy',
        },
        {
          title: this.$t('设备'),
          align: 'center',
          dataIndex: 'deviceId_dictText',
          customRender:function(text,record){
            if(!text){
              return ''
            }else{
              return record.deviceId_dictText + '('+record.deviceId +')'
            }
          }
        },
      ],
    }
  },
  created() {},
  computed: {},
  methods: {
    initDictConfig() {
      initDictOptions('bis_system_card_record.type').then((res) => {
        if (res.success) {
          this.typeList = res.result
          this.typeList.unshift({ value: '', title: this.$t('全部') })
        }
      })
    },
    edit(record) {
      this.visible = true
      console.log(record)
      this.initDictConfig()
      this.dataSource = []
      this.queryParam = {
        column: 'createTime',
        order: 'desc',
        createTime_begin: '',
        createTime_end: '',
        type: '',
        cardInfo: '',
      }
      this.info = Object.assign({},record)
      this.getRecord()

    },
    getRecord() {
      let query = {}
      query = this.queryParam
      query.cardSn = this.info.cardSn
      this.loading = true
      getAction('/system/bisSystemCardRecord/list', query).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records
        }else{
          this.$message.warning(res.message)
        }
      }).finally(() => {
        this.loading = false
      })
    },
    handleCancel() {
      this.visible = false
    },
  },
}
</script>

  <style>
</style>